
// main color
$haokur_main_bg : #F6F4F5;
$haokur_main:red;
$haokur_placeholder:#FFF;
$haokur_input_color:#008ef6;
$haokur_gold:#f8cd02;
$haokur_btn_color:#1f3595;
$haokur_btn_link:#00a4ff;
$haokur_header_bgcolor: -moz-linear-gradient(to bottom, red, rgba(0, 0, 255, 0.5));  
// global style
a{
    display: block;
}
.no-more-data{
    display: block;
    line-height: 40px;
    text-align: center;
    color: #3c49b6;
}
.backdrop{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    display: block;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: .01;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    opacity: .3;
}
.haokur-common-header{
    .toolbar-background{
        background:transparent;
        border-bottom: none!important;
    }
    .toolbar-title{
        color:$haokur_gold;

    }
}
.haokur-common-content{
    background-image: url('../assets/bg640.png');
    // background:red!important;
    background-size: cover;
    background-position: center center;
}
.haokur{
    h1,h2,h3,h4,h5{
        margin:0;
        padding:0;
    }
    input{
        appearance: none;
        -webkit-appearance: none;
        background:none;
        border:none;
    }
    ::-webkit-input-placeholder { /* WebKit browsers */ 
        color: $haokur_placeholder; 
        font-size:14px;
    }
    .fixed-bg{
        // position: fixed;
        // top:0;
        // left:0;
        // z-index:0;
        // width:100%;
        // height:100%;
        // background-repeat:no-repeat ;
        // background-position: center center;
        // background-size: 100% auto;
    }
    .no-data{
        background:rgba(44,73,182,.8);
        text-align: center;
        padding:20px;
        color:$haokur_btn_link;
    }
    .common-content{
        position: relative;
        z-index: 1;
    }
    .accout-form-container{
        .form{
            padding:0 30px;
            margin-top:80px;
        }
        .login-form{
            // margin-top:56px;
            margin-top:20px;
        }
        input{
            width:100%;
            border-bottom:1px solid #00a4ff;
            padding:10px 10px 10px 56px;
            line-height:40px;
            color:$haokur_input_color;
            font-size:16px;
        }
        .full-border{
            border:1px solid #00a4ff;
            border-radius: 4px;
            line-height:20px;
            padding:10px 10px 10px 46px;
        }
    }
    .common-header{
        position: relative;
        height:44px;
        .header-btn{
            position: relative;
            z-index: 9;
            width:44px;
            height:44px;
            text-align: center;
            line-height: 44px;
            color:$haokur_gold;
            img{
                width:22px;
                vertical-align:middle;
            }
        }
        .header-right-cancel{
            img{
                width: 16px;
            }
        }
        .common-title{
            position: absolute;
            top:0;
            left:0;
            width:100%;
            height:44px;
            margin:0;
            color:$haokur_gold;
            font-size:20px;
            text-align: center;
            padding:0 40px;
            line-height: 44px;
        }
    }
    .common-header-bg{
        background:linear-gradient(to top, #0c1437, rgba(23,35,91,.8)); 
        background:-webkit-linear-gradient(to top, #0c1437, rgba(23,35,91,.8)); 
    }
    .header-fixed{
        position: fixed;
        width:100%;
        left:0;
        top:0;
        z-index:3;
    }
    .padding-header-content{
        // padding-top:44px;
    }
    .form{
        .form-row{
            position: relative;
        }
        .form-row-icon{
            position: absolute;
            left:8px;
            top:10px;
            line-height:40px;
            img{
                width: 20px;
                display: inline-block;
                vertical-align: middle;
            }
        }
        .form-row-fullborder{
            .form-row-icon{
                position: absolute;
                left:12px;
                top:10px;
                line-height:20px;
                img{
                    width: 20px;
                    display: inline-block;
                    vertical-align: middle;
                }
            }
        }
        .form-row-btn{
            position: absolute;
            top:10px;
            right:0;
            line-height: 40px;
            color:$haokur_gold;
        }
        .form-row-tip{
            position: absolute;
            top:10px;
            right:0;
            line-height: 40px;
            color:$haokur_placeholder;
        }
        .form-btn{
            margin-top:50px;
            button {
                width:100%;
                height:42px;
                line-height: 42px;
                text-align: center;
                background:$haokur_gold;
                color:$haokur_placeholder;
                border-radius: 4px;
                font-size: 18px;
            }
        }
        .form-login-btn{
            margin-top:20px;
        }
    }
    // 积分类
    .point-wrap{
        padding:30px 16px;
    }
    .point-block{
        background:rgba(44,73,182,.8);
        border-radius: 4px;
        padding:20px;
        color:$haokur_input_color;
    }
    .point-title{
        font-size:18px;
    }
    .point-main{
    }
    .point-info{
        font-size:36px;
        font-weight: 500;
        text-align: center;
        margin:20px auto;
    }
    .point-tip{
        font-size:14px;
        line-height: 1.5;
        .icon{
            margin-right: 2px;
            color:#ff3d3d;
            vertical-align: middle;
        }
    }
    .point-detail{
        margin-top:12px;
        background:rgba(44,73,182,.8);
    }
    .point-detail-bar{
        line-height: 48px;
        color:$haokur_input_color;
        padding:0 16px;
        border-bottom: 1px solid $haokur_btn_link;
        font-size:14px;
        b{
            font-size:17px;
            font-weight: 500;
        }
        .icon{
            vertical-align: middle;
        }
    }
    .point-detail-list{
        background:rgba(44,73,182,.8);
        border-radius: 4px;
    }
    .point-detail-item{
        padding:16px;
        border-bottom:1px solid $haokur_btn_link;
        &:last-child{
            border-bottom: none;
        }
        .point-title{
            color:$haokur_input_color;
            font-size: 17px;
            font-weight: 500;
            line-height: 30px;
        }
        .point-date{
            font-size: 14px;
            color:#007ad3;
            line-height: 20px;
        }
        .point-money{
            color:$haokur_gold;
            font-size: 24px;
            text-align: right;
            font-weight: 500;
            line-height: 50px;
            .point-money-pay{
                color:#ff3d3d;
            }
        }
    }
}